<template>
<view class="mine-container">
	<view >
		<view>
			<image class="avatar" src="../../static/logo.png" mode=""></image>
		</view>
		<view class="person-container">
			<text class="name">人物名称</text>
			<text class="text">示例文本示例文本示例文本示例文本</text>
			<text class="fans_number">160</text>
			<text class="fans">粉丝</text>
			<view class="line1"></view>
			<text class="followers_number">17</text>
			<text class="followers">关注</text>
			<view class="line2"></view>
			<text class="news_number">347</text>
			<text class="news">动态</text>
			<view>
				<image class="thumbs_up" src="../../static/images/mine/thumbs_up.png"></image>
				<image class="tip" src="../../static/images/mine/card.png"></image>
				<image class="love" src="../../static/images/mine/love.png"></image>
				<image class="mention" src="../../static/images/mine/mention.png"></image>
				<text class="text1" id="first">示例的的</text>
				<text class="text1" id="second">示例</text>
				<text class="text1" id="third">示例</text>
				<text class="text1" id="forth">示例</text>
			</view>
		</view>
	</view>
	<scroll-view class="cardlist">
		<view class="card">
			<image class="inbox" src="../../static/images/mine/Icons _ Messaging _ inbox.png"></image>
			<text class="title">资料认证</text>
			<text class="message">在此处认证您的资料</text>
			<image class="arrow-right" src="../../static/images/message/arrow-right.png"></image>
		</view>
		<view class="card">
			
		</view>
	</scroll-view> 
		
</view>
</template>



<style>
	page{
	height:100%;
	}
	.avatar{
		position: absolute;
		width: 88px;
		height: 88px;
		left: 173px;
		top: 13.6px;
		z-index: 99;
	}
	.mine-container{
		position: relative;
		background-color: rgb(255, 255, 255);
		height: 100%;
		width: 100%;
		
	}
	.person-container{
		position: relative;
		width: 399px;
		height: 246px;
		left: 16px;
		top: 63px;
		background-color: white;
		box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
		border-radius:13px;
		display: inline-block;
		font-family: PingFang SC;
		letter-spacing: 0px;
		text-align: left;
	}
	
	.name{
		/* 人物名称 */
		position: absolute;
		width: 100%;
		height: 27px;
		top: 40.4px;
		font-weight: 500;
		color: rgb(0, 0, 0);
		font-size: 19px;
		background-color:white;
		text-align: center;
	}
	.text{
		/* 示例文本示例文本示例文本示例文本 */
		position: absolute;
		width: 100%;
		height: 21px;
		top: 70px;
	
		color: rgb(145, 145, 145);
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: undefined;
		line-height: 21px;
		letter-spacing: 0px;
		text-align: center;
	}
	.fans_number{
		/* 160 */
		position: absolute;
		width: 30px;
		height: 27px;
		left: 105px;
		top: 96.4px;
		
		color: rgb(0, 0, 0);
		font-size: 18px;
		font-weight: undefined;
		line-height: 27px;
		
	}
	.fans{
		/* 粉丝 */
		position: absolute;
		width: 24px;
		height: 18px;
		left: 109.5px;
		top: 120.3px;
		
		color: rgb(145, 145, 145);
		font-size: 12px;
		font-weight: undefined;
		line-height: 18px;
		

	}
	.followers_number{
		/* 17 */
		position: absolute;
		width: 20px;
		height: 27px;
		left: 185px;
		top: 96.4px;
		
		color: rgb(0, 0, 0);
		font-size: 18px;
		font-weight: undefined;
		line-height: 27px;
	}
	.followers{
		/* 关注 */
		position: absolute;
		width: 24px;
		height: 18px;
		left: 183.5px;
		top: 120.3px;
		
		color: rgb(145, 145, 145);
		font-size: 12px;
		font-weight: undefined;
		line-height: 18px;
	}
	.news_number{
		/* 347 */
		position: absolute;
		width: 30px;
		height: 27px;
		left: 258px;
		top: 96.4px;
		
		color: rgb(0, 0, 0);
		font-size: 18px;
		font-weight: undefined;
		line-height: 27px;
	}
	.news{
		/* 动态 */
		position: absolute;
		width: 24px;
		height: 18px;
		left: 262px;
		top: 120.3px;
	
		color: rgb(145, 145, 145);
		font-size: 12px;
		font-weight: undefined;
		line-height: 18px;
	}
	.line1{
		/* 直线 1 */
		position: absolute;
		width: 38px;
		height: 0;
		left: 139.75px;
		top: 118px;
		
		border: 1px solid rgb(112, 112, 112);
		transform: rotate(-90.00deg);
	}
	.line2{
		/* 直线 2 */
		position: absolute;
		width: 38px;
		height: 0;
		left: 215.75px;
		top: 118px;
		
		border: 1px solid rgb(112, 112, 112);
		transform: rotate(-90.00deg);
	}
	.thumbs_up{
		position: absolute;
		width: 32px;
		height: 32px;
		left: 32.86px;
		top: 160px;
	}
	.tip{
		position: absolute;
		width: 32px;
		height: 32px;
		left: 130px;
		top: 160px;
	}
	.love{
		position: absolute;
		width: 32px;
		height: 32px;
		left: 226px;
		top: 160px;
	}
	.mention{
		position: absolute;
		width: 32px;
		height: 32px;
		left: 323px;
		top: 160px;
	}
	.text1{
		/* 示例 */
		position: absolute;
		background-color: white;
		width: 70px;
		height: 21px;
		color: rgb(121, 121, 121);
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: undefined;
		line-height: 21px;
		letter-spacing: 0px;
		text-align: center;
	}
	#first{
		left: 15px;
		top: 196px;
	}
	#second{
		left: 112px;
		top: 196px;
	}
	#third{
		left: 207px;
		top: 196px;
	}
	#forth{
		left: 304px;
		top: 196px;
	}
	.cardlist{
		position: absolute;
		width:100%;
		height:360px;
		background-color: white;
		top: 330px;
	}
	.card{
		/* 矩形 20 */
		position: relative;
		width: 399px;
		height: 85px;
		left: 16px;
		background: rgb(255, 255, 255);
		box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
		border-radius:13px;
		margin-bottom: 10px;
	}
	.inbox{
		/* Icons / Messaging / inbox */
		position: absolute;
		width: 24.17px;
		height: 20px;
		left: 30rpx;
		top: 32px;
	}
	.title{
		/* 资料认证 */
		position: absolute;
		width: 200px;
		height: 22px;
		left: 116rpx;
		top: 40rpx;
		
		color: rgb(0, 0, 0);
		font-family: PingFang SC;
		font-size: 15px;
		font-weight: undefined;
		line-height: 22px;
		letter-spacing: 0px;
		text-align: left;
	}
	.message{
		/* 在此处认证您的资料 */
		position: absolute;
		width: 300px;
		height: 21px;
		left: 116rpx;
		top: 75rpx;
		
		color: rgb(145, 145, 145);
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: undefined;
		line-height: 21px;
		letter-spacing: 0px;
		text-align: left;
	}
	.arrow-right{
		/* Icons / Arrows / arrow-right-1 */
		position: absolute;
		width: 26.5rpx;
		height: 41.76rpx;
		left: 640rpx;
		top: 56.2rpx;
	
	}
</style>